<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0"> -->
  <link rel="stylesheet" href="/web/css/reset.css">
  <link rel="stylesheet" href="/web/css/head.css" />
  <link rel="stylesheet" href="/web/css/detail.css">
  <script src="https://cdn.bootcss.com/vue/2.6.10/vue.min.js"></script>
  <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
  <script src="https://unpkg.com/element-ui/lib/index.js"></script>
  <title>详情</title>
  <style>
    [v-cloak] {
      display: none;
    }

  </style>
</head>

<body>
  <div id="app" v-cloak>
    <header class="header">
      <div class="container clearfix">
        <div class="fl left">
          <a href="javascript:void(0)"><img src="/web/images/logo.png" alt="" class="img1" /></a>
        </div>
        <div class="fr nav">
          <ul class="navbar_nav" data-in="fadeInDown" data-out="fadeOutUp">
            <li>
              <a href="/index.html">首页</a>
            </li>
            <li class="dropdown">
              <a href="/pro.html">
                产品服务
              </a>
            </li>
            <li class="dropdown">
              <a href="/science.html">普联科技</a>
            </li>
            <li class="header-active">
              <a href="/news.html">新闻动态</a>
            </li>
            <li>
              <a href="/help.html">帮助与支持</a>
            </li>
            <li>
              <a href="/about.html">关于我们</a>
            </li>
          </ul>
        </div>
        <a href="javascript:void(0)" id="navToggle">
          <span></span>
        </a>
      </div>
    </header>
    <div class="banner">
      <img src="/web/images/news/xinwen-bgc_01.png" alt="">
    </div>

    <div class="content-wrapper">
      <div class="detail-container">
        <div class="dc-top">
          <div class="shu-gang"></div>
          <p>当前位置：
            <a href="/news.html" style="color: #2e64ae;">新闻动态</a> >
            <span>{{BreadStr}}</span>
          </p>
        </div>


        <!-- 内容放这里 -->
        <div class="detail-content">

          <h3>{{title}}</h3>
          <p class="sub-title">
            <span style="margin-left: 6px;">{{time}}</span>
          </p>
          <div style="font-size: 16px;" class="content-box">${data.content}</div>
        </div>

        <div class="btn-wrap">
          <div class="btn-div" :class="{ 'btn-disabled': !prevbtnFlag }" @click="navArticle(1)">
            <span class="circle">
              <i class="left-arrow "></i>
            </span>
            <span class="arrow-span">上一篇</span>
          </div>
          <div class="btn-div" :class="{ 'btn-disabled': !nextbtnFlag }" @click="navArticle(2)">
            <span class="arrow-span">下一篇</span>
            <span class="circle circle2"> <i class="right-arrow"></i></span>
          </div>

        </div>
      </div>
    </div>


    <div class="common-footer">
      <div class="footer_lxwm">
        <ul class="wbsx">
          <li><img src="/web/images/sy/footer_wb.png">
            <p>企业微博</p>
          </li>
          <li><img src="/web/images/sy/footer_gzh.png">
            <p>企业公众号</p>
          </li>
          <li><img src="/web/images/sy/footer_dy.png">
            <p>抖音二维码</p>
          </li>
        </ul>
        <a href="javascript:void(0);"><img src="/web/images/sy/footer_bt.png"></a>

      </div>
      <div class="lxfs_box">
        <span class="sb_1"><img src="/web/images/sy/footer_icon_dianhua.png">电话：4000-365-108</span>
        <span class="sb_1"><img src="/web/images/sy/footer_icon_mail.png">邮箱：business@puldw.com</span>
        <span class="sb_1"><img src="/web/images/sy/footer_icon_dizhi.png">地址：武汉市江汉经济开发区江兴路17号A栋3楼02号(中信大楼)</span>
        <p><img src="/web/images/sy/footer_icon_banquan.png">版权所有 2018-2020 武汉普联东文数据服务有限责任公司 · 鄂ICP备17023599号-2</p>
      </div>
    </div>
  </div>

</body>
<script src="/web/js/jquery.min.js"></script>
<script src="/web/js/news.js"></script>
<script>

    var title = '${data.title}';
    var origin = '${data.origin}';

    var time = '${data.time}';
    var hasLast = ${data.hasLast};
    var lastId = ${data.lastId};
    var hasNext = ${data.hasNext};
    var nextId = ${data.nextId};


  var app = new Vue({
    el: '#app',
    data: {
      title: title,
      subTitle: origin,
      time: time,
      //content: content,
      // 此变量为false时 上一篇按钮禁用
      prevbtnFlag: true,
      // 此变量为false时 下一篇按钮禁用
      nextbtnFlag: true,
      BreadStr: '公司动态'

    },
    mounted() {
        this.init();
      //this.getTableData();
    },
    methods: {
        init(){
            if(hasLast==1){
                this.prevbtnFlag = true;
            }else{
                this.prevbtnFlag = false;
            }

            if(hasNext==1){
                this.nextbtnFlag = true;
            }else{
                this.nextbtnFlag = false;
            }
        },
      navArticle(_type) {
        // _type 为1  上一篇 为2下一篇
        if(_type==1){
            window.location.href = '/detail.html/'+lastId;
        }else{
            window.location.href = '/detail.html/'+nextId;
        }
      },
      getTableData() {
        // let p = {};
        // let _url = 'http://10.0.0.147:8060/admin/news/list';
        // p.start = (this.table.currentPage - 1) * this.table.pageSize;
        // p.num = this.table.pageSize;
        // var that = this;
        // console.log(p);
        // $.ajax({
        // 	type: 'POST',
        // 	url: _url,
        // 	data: p,
        // 	success: function (res) {
        // 		console.log(res);
        // 		that.table.tableData = res.data.rows;
        // 		that.table.rowCount = res.data.total;
        // 		console.log(that.table.tableData);
        // 	}
        // });
      }
    },
  })

</script>

</html>
